<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<%@ taglib uri="http://www.atg.com/taglibs/daf/dspjspTaglib1_0"
	prefix="dsp"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fn" prefix="fn"%>
<%@ page isELIgnored="false"%>
<dsp:page>
	<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<%@include file="style.jspf"%>
<dsp:importbean bean="/atg/commerce/catalog/ProductLookup" />
<dsp:importbean bean="/atg/commerce/catalog/SKULookup" />
<dsp:importbean bean="/atg/dynamo/droplet/Switch" />
<dsp:importbean bean="/atg/commerce/order/ShoppingCartModifier" />
<dsp:importbean bean="/atg/dynamo/droplet/ErrorMessageForEach" />
<title>Product Detail</title>
<script language="javascript">
	
	//Browser Version Detection
	var BrowserDetect = {
	  init: function () {
	    this.browser = this.searchString(this.dataBrowser) || "An unknown browser";
	    this.version = this.searchVersion(navigator.userAgent)
	      || this.searchVersion(navigator.appVersion)
	      || "an unknown version";
	    this.OS = this.searchString(this.dataOS) || "an unknown OS";
	  },
	  searchString: function (data) {
	    for (var i=0;i<data.length;i++)  {
	      var dataString = data[i].string;
	      var dataProp = data[i].prop;
	      this.versionSearchString = data[i].versionSearch || data[i].identity;
	      if (dataString) {
	        if (dataString.indexOf(data[i].subString) != -1)
	          return data[i].identity;
	      }
	      else if (dataProp)
	        return data[i].identity;
	    }
	  },
	  searchVersion: function (dataString) {
	    var index = dataString.indexOf(this.versionSearchString);
	    if (index == -1) return;
	    return parseFloat(dataString.substring(index+this.versionSearchString.length+1));
	  },
	  dataBrowser: [
	    {
	      string: navigator.userAgent,
	      subString: "Chrome",
	      identity: "Chrome"
	    },
	    {   string: navigator.userAgent,
	      subString: "OmniWeb",
	      versionSearch: "OmniWeb/",
	      identity: "OmniWeb"
	    },
	    {
	      string: navigator.vendor,
	      subString: "Apple",
	      identity: "Safari",
	      versionSearch: "Version"
	    },
	    {
	      prop: window.opera,
	      identity: "Opera"
	    },
	    {
	      string: navigator.vendor,
	      subString: "iCab",
	      identity: "iCab"
	    },
	    {
	      string: navigator.vendor,
	      subString: "KDE",
	      identity: "Konqueror"
	    },
	    {
	      string: navigator.userAgent,
	      subString: "Firefox",
	      identity: "Firefox"
	    },
	    {
	      string: navigator.vendor,
	      subString: "Camino",
	      identity: "Camino"
	    },
	    {    // for newer Netscapes (6+)
	      string: navigator.userAgent,
	      subString: "Netscape",
	      identity: "Netscape"
	    },
	    {
	      string: navigator.userAgent,
	      subString: "MSIE",
	      identity: "Microsoft Internet Explorer",
	      versionSearch: "MSIE"
	    },
	    {
	      string: navigator.userAgent,
	      subString: "Gecko",
	      identity: "Mozilla",
	      versionSearch: "rv"
	    },
	    {     // for older Netscapes (4-)
	      string: navigator.userAgent,
	      subString: "Mozilla",
	      identity: "Netscape",
	      versionSearch: "Mozilla"
	    }
	  ],
	  dataOS : [
	    {
	      string: navigator.platform,
	      subString: "Win",
	      identity: "Windows"
	    },
	    {
	      string: navigator.platform,
	      subString: "Mac",
	      identity: "Mac"
	    },
	    {
	         string: navigator.userAgent,
	         subString: "iPhone",
	         identity: "iPhone/iPod"
	      },
	    {
	      string: navigator.platform,
	      subString: "Linux",
	      identity: "Linux"
	    }
	  ]
	
	};
	BrowserDetect.init();

	function typeSelect(pId) {
		var index = document.productDetail.type.selectedIndex;
		var value = document.productDetail.type.options[index].value;
		var url = "productDetail.jsp?pId=" + pId + "&skuId=" + value;
		window.open(url,"_self");		
	}
	
	function getParameterByName(name)
	{
	  name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
	  var regexS = "[\\?&]" + name + "=([^&#]*)";
	  var regex = new RegExp(regexS);
	  var results = regex.exec(window.location.search);
	  if(results == null)
	    return "";
	  else
	    return decodeURIComponent(results[1].replace(/\+/g, " "));
	}
	
	var selval = getParameterByName("skuId");	
</script>
	</head>
	<body>
		<div id="wrap" class="clear-block">
			<div id="header">
				<dsp:include page="header.jsp" />
			</div>
			<div id="mainnav">
				<dsp:include page="categoryBar.jsp" />
			</div>
			<div id="main">
			
				<div class="breadcrumb">
					<a href="index.jsp">Home</a> <span class="cutline">&raquo;</span> <a
						href="category.jsp">breadcrumb</a> <span class="cutline">&raquo;</span>
					<a href="productList.jsp">breadcrumb</a> <span class="cutline">&raquo;</span>
					<span class="green">breadcrumb</span>
				</div>
				
				<dsp:droplet name="Switch">
					<dsp:param bean="ShoppingCartModifier.formError" name="value" />
					<dsp:oparam name="true">
						<dsp:droplet name="ErrorMessageForEach">
							<dsp:param bean="ShoppingCartModifier.formExceptions"
								name="exceptions" />
							<dsp:oparam name="output">
								<div class="errorBox">
									<dsp:valueof param="message" />
								</div>
							</dsp:oparam>
						</dsp:droplet>
					</dsp:oparam>
				</dsp:droplet>

				<dsp:droplet name="ProductLookup">
				<dsp:param name="id" param="pId" />
				<dsp:param name="elementName" value="product" />
				<dsp:oparam name="output">	
					<dsp:getvalueof var="skuId" param="skuId"/>
					<c:if test="${empty skuId}">								
						<dsp:setvalue param="sku" paramvalue="product.childSKUs[0]"/>
						<dsp:include page="./productDetailInclude.jsp"/>										
					</c:if>					
					<c:if test="${not empty skuId}">				
					<dsp:droplet name="SKULookup">
						<dsp:param name="id" value="${skuId}" />
						<dsp:param name="elementName" value="sku" />
						<dsp:oparam name="output">						
							<dsp:include page="productDetailInclude.jsp"/>		
						</dsp:oparam>	
						</dsp:droplet>
					</c:if>					
				</dsp:oparam>	
				</dsp:droplet>	
															
			</div>
			<div id="footer">
				<dsp:include page="footer.jsp" />
			</div>
		</div>
		<script language="javascript">
			if (BrowserDetect.browser != 'Firefox') {
			   	var i;
				var len = productDetail.type.length; 
				for (i =0; i<len;i++) {
					var val = productDetail.type.options[i].value;
					if (val==selval) {
						productDetail.type.options[i].selected = true;
						break;
					}				 
				}
			} else {
				var cbo=document.getElementById("skuSelect");
				for(var i=0; i<cbo.length; i++){
					if(cbo.options[i].value == selval){
						cbo.selectedIndex=i;
					break;
					}
								
				}
			}
				
		</script>		
	</body>	
</dsp:page>
</html>